<!-- 售后订单详情 -->
<template>
    <view class="box">
        <view style="height: 30rpx;"></view>
        <view class="box-card">
            <view class="lable">基本信息</view>
            <view class="box-card-list">
                <view class="card-list-1">售后订单：</view>
                <view class="card-list-2">{{refund_info.refund_sn}}</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">售后状态：</view>
                <view class="card-list-2" v-if="refund_info.refund_state=='1'">处理中</view>
				<view class="card-list-2" v-if="refund_info.refund_state=='2'">待审核</view>
				<view class="card-list-2" v-if="refund_info.refund_state=='3'">已完成</view>
				<view class="card-list-2" v-if="refund_info.refund_state=='4'">已取消</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">售后类型：</view>
                <view class="card-list-2">{{refund_info.refund_type_txt}}</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">款项退回路径：</view>
                <view class="card-list-2">原路退回</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">申请时间：</view>
                <view class="card-list-2">{{refund_info.add_datetime}}</view>
            </view>
        </view>
        
        <view class="box-card">
            <view class="lable">订单信息</view>
            <view class="box-card-list">
                <view class="card-list-1">订单编号：</view>
                <view class="card-list-2">{{order_info.order_sn}}</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">门店名称：</view>
                <view class="card-list-2">{{order_info.physical_name}}</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">下单时间：</view>
                <view class="card-list-2">{{order_info.add_datetime}}</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">订单状态：</view>
                <view class="card-list-2">{{order_info.order_state_txt}}</view>
            </view>
            <view class="box-card-list">
                <view class="card-list-1">商品：</view>
            </view>
            <view class="order-list-1"  v-for="(item,index) in order_info.goods_list">
                <view class="order-list-2">
                    <view class="order-list-icon">
                        <image :src="item.goods_image_url"></image>
                    </view>
                    <view class="order-info">
                        <view class="order-name">{{item.goods_name}}</view>
                        <view class="order-text-list">
                            <view class="order-price">{{'¥'+item.goods_pay_price}}</view>
                            <view class="order-count">{{'x'+item.goods_num}}</view>
                        </view>
                    </view>
                </view>
            </view>
        </view>
    </view>    
</template>

<script>
    export default {
        data() {
            return {
                refund_id:"",
				refund_info:{},//售后信息
				order_info:{},//订单信息
            }
        },
		onLoad(option) {
			this.refund_id=option.refund_id
		},
		onReady() {
			this.getDetail()
		},
        methods: {
            getDetail(){
				let url = '';
				if (!uni.getStorageSync("key")) {
					return uni.redirectTo({
						url: "/SupplyEnd/login/login",
					});
				}
				url = "/mobile/index.php?act=supplier-refund&op=detail";
				let that = this
				this.$util.request({
					url: url,
					method: 'get',
					data: {
						refund_id:that.refund_id
					}
				}).then(res => {
					if (res.error_code == 0) {
						//更新页面数据
						that.refund_info=res.datas.refund_info
						that.order_info=res.datas.order_info
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				})
			}
        },
		onBackPress() {
			// #ifdef APP-PLUS
			plus.key.hideSoftKeybord();
			uni.navigateTo({
				url:"/SupplyEnd/good/aftersaleslist"
			})
			// #endif
		}
	}
</script>

<style lang="scss" scoped>
    page {
        background: #F7F7F7;
    }
    .box{
        margin:0 30rpx;
    }
    .box-card{
        background: #FFFFFF;
        border-radius: 10rpx 10rpx 10rpx 10rpx;
        opacity: 1;
        padding: 20rpx;
        margin-bottom: 30rpx;
        .lable{
            font-size: 30rpx;
            font-family: PingFang SC-Medium, PingFang SC;
            font-weight: 500;
            color: #323232;
        }
        .box-card-list{
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-top: 30rpx;
            .card-list-1{
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #333333;
            }
            .card-list-2{
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #646464;
            }
        }
    }
    
    .order-list-1 {
        background-color: #FFF;
        border-radius: 5rpx 5rpx 5rpx 5rpx;
        display: flex;
        flex-direction: column;
        // padding: 30rpx;
        position: relative;
        //margin-bottom: 30rpx;
		border-bottom: 2rpx solid #EEEEEE;
    
        .order-list-1-subscript {
            width: 130rpx;
            height: 130rpx;
    
            position: absolute;
            top: 0;
            left: 0;
            z-index: 9;
        }
    
        .order-list-info {
            display: flex;
            justify-content: space-between;
    
            .order-shopname {
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #323232;
                display: flex;
                flex-direction: row;
                align-items: center;
    
                .shop-icon {
                    width: 38rpx;
                    height: 38rpx;
                    background: linear-gradient(180deg, #EA8C1E 0%, #E84A1D 100%);
                    opacity: 1;
    
                    font-size: 20rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #FFFFFF;
    
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    border-radius: 50%;
                    margin-right: 10rpx;
                    
                    text{
                        transform: scale(0.8);
                        font-family: 500;
                    }
                }
            }
    
            .order-stutas {
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #E96A1D;
            }
            .order-stutas2 {
                font-size: 28rpx;
                font-family: PingFang SC-Regular, PingFang SC;
                font-weight: 400;
                color: #323232;
            }
        }
    
        .order-list-2 {
            display: flex;
            margin-top: 20rpx;
            padding-bottom: 30rpx;
    
            .order-list-icon {
                width: 200rpx;
                height: 200rpx;
    
                image {
                    width: 200rpx;
                    height: 200rpx;
                    border-radius: 5rpx;
                }
            }
    
            .order-info {
                margin-left: 30rpx;
                position: relative;
                width: 100%;
				display:flex;
				flex-direction: column;
				justify-content: space-between;
                .order-name {
                    font-size: 28rpx;
                    font-family: PingFang SC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #323232;
                }
                .order-name-sp-list{
                    .order-name-sp{
                        height: 32rpx;
                        font-size: 24rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #909090;
                    }
                }
                .order-text-list{
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    margin-top: 13rpx;
                    .order-price {
                        font-size: 30rpx;
                        font-family: PingFang SC-Medium, PingFang SC;
                        font-weight: 500;
                        color: #E96A1D;
                    }
                    .order-count {
                        font-size: 24rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #323232;
                    }
                }
                .order-text {
                    position: absolute;
                    bottom: 43rpx;
                    left: 0;
                    right: 0;
                    display: flex;
                    align-items: center;
    
                    .order-price {
                        font-size: 30rpx;
                        font-family: PingFang SC-Medium, PingFang SC;
                        font-weight: 500;
                        color: #E96A1D;
                    }
    
                    .order-score {
                        font-size: 30rpx;
                        font-family: PingFang SC-Medium, PingFang SC;
                        font-weight: 500;
                        color: #909090;
                    }
    
                    /deep/ .uni-rate {
                        margin-top: 10rpx;
                    }
    
                    .order-score-icon {
                        display: flex;
                        align-items: center;
                    }
                }
    
                .order-text2 {
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
    
                    .order-count {
                        font-size: 24rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #323232;
                    }
    
                    .order-num {
                        font-size: 24rpx;
                        font-family: PingFang SC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #323232;
                    }
                }
            }
        }
        .order-text{
            font-size: 24rpx;
            font-family: PingFang SC-Regular, PingFang SC;
            font-weight: 400;
            color: #909090;
            margin-bottom: 16rpx;
        }
    }
	.order-list-1:last-child{
		border-bottom: none;
	}
</style>